<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
	<title>省市县三级联动案例</title>
	<link rel="stylesheet" href="./css/index.css" />
	<script src="./lib/jquery.js"></script>
	<script src="./lib/axios.js"></script>
</head>

<body>
	<div class="list-box">
		<div class="item">
			<span>省份：</span>
			<select id="province">
				<option value="">请选择省份</option>
			</select>
		</div>
		<div class="item">
			<span>城市：</span>
			<select id="city">
				<option value="">请选择城市</option>
			</select>
		</div>
		<div class="item">
			<span>区县：</span>
			<select id="county">
				<option value="">请选择区县</option>
			</select>
		</div>
	</div>
</body>
<script src="./js/index.js"></script>
<script>
	// // 设置请求根路径
	// axios.defaults.baseURL = 'http://124.223.14.236:3001/api'

	// async function fn() {
	// 	const { data } = await axios.get('/city/province')
	// 	// 省的数据
	// 	console.log(data);

	// 	const provinceArea = data.data.map((item) => `
	// 	<option value="">${item.name}</option>
	// 	`).join('')

	// 	$('#province').html(provinceArea)


	// 	// 安徽省下所有的数据
	// 	const { data: cityData } = await axios.get('/city/city', {
	// 		params: {
	// 			provinceCode: '34'
	// 		}
	// 	})
	// 	console.log(cityData);

	// 	const cityArea = cityData.data.map(item => `
	// 		<option value="">${item.name}</option>
	// 		`
	// 	).join('')
	// 	$('#city').html(cityArea)



	// 	// 获取芜湖市下所有的区
	// 	const { data: areaData } = await axios.get('/city/area', {
	// 		params: {
	// 			provinceCode: '34',
	// 			cityCode: '02'
	// 		}
	// 	})
	// 	console.log(areaData);
	// }
	// fn()
</script>

</html>